/**
 * 篷布监测弹窗
 */

import { Empty, Modal } from "antd";
import { FC } from "react";
import { ModalBox } from "../../style";
import { useWindowFontSize } from "../../../../assets/fun/Antd/configprovider";
import { MyObject } from "../..";

const Pengbujiance: FC<{
  open: boolean;
  onCancel: () => void;
  wsData?: MyObject;
}> = ({ open, onCancel, wsData }) => {
  return (
    <Modal
      title="篷布监测"
      closable={{ "aria-label": "Custom Close Button" }}
      open={open}
      onCancel={onCancel}
      width={useWindowFontSize(700)}
      getContainer={false}
      footer={null}
    >
      <ModalBox $img={wsData && wsData.url}>
        <div className="iamge_box">{!(wsData && wsData.url) && <Empty description="暂无图片" />}</div>

        <div className="button_box">
          <div className="btn">车牌号:{wsData?.carNo}</div>
          <div className="btn">
            篷布监测:<span>打开</span>
          </div>
        </div>
        <div className="btn_guanbi" onClick={onCancel}>
          关闭
        </div>
      </ModalBox>
    </Modal>
  );
};

export default Pengbujiance;
